const studyMins = 25;
const restMins = 5;
const timerInterval = 1000;
let isStudying = false;
let timerPause;
let remainingSeconds;
let minNow;
let secondNow;

let loop;
let tomatoSize;

let bgmVolume;
let bgmSilence;
let soundVolume;
let soundSilence;

let stduyTimer;
let restTimer;

window.onload = function() {
    initProgram();
    loadDataFromlocalStorage();
    loop = readDataFromlocalStorage('loop') == 'true' ? true : false;
    tomatoSize = readDataFromlocalStorage('tomatoSize') ? parseInt(readDataFromlocalStorage('tomatoSize')) : 1;
    bgmVolume = readDataFromlocalStorage('bgmVolume') ? parseInt(readDataFromlocalStorage('bgmVolume')) : 100;
    bgmSilence = readDataFromlocalStorage('bgmSilence') == 'true' ? true : false;
    soundVolume = readDataFromlocalStorage('soundVolume') ? parseInt(readDataFromlocalStorage('soundVolume')) : 100;
    soundSilence = readDataFromlocalStorage('soundSilence') == 'true' ? true : false;

    setSound();

    $('.start').click(function() { startStudy(); });
    $('.header-button-settings').click(function() { openSetting(); });
    $('.loop').click(function() { clickLoop(); });
    $('.pause').click(function() { pauseStudy(); });
    $('.terminate').click(function() { terminate(); });
};

function initProgram() {
    $('.time').css('display', 'none');
    $('.start').css('display', 'flex');
    $('.pause').css('display', 'none');
    $('.pause').html('');
    $('.terminate').css('display', 'none');
    $('svg circle').css('stroke-dashoffset', 1250); // 让圆圈清空：340 完全闭合 1250 空
};

function setSound() {
    $('[class*=selection]').off('click');
    $('[class*=button]').off('click');
    $('[class*=checkbox]').off('click');
    $('[class*=selection]').click(function() { sound('select'); });
    $('[class*=button]').click(function() { sound('click'); });
    $('[class*=checkbox]').click(function() { sound('click'); });
}

// 格式化时间数字
function formatTime() {
    minNow = minNow + ''; // 变成字符，不然不能使用 padStart 函数
    secondNow = secondNow + ''; // 变成字符，不然不能使用 padStart 函数
    $('.time .minute').html(minNow.padStart(2, '0'));
    $('.time .second').html(secondNow.padStart(2, '0'));
};

// 初始化时钟：mode == 'study' or 'rest'
function initClock(mode) {
    $('.time').css('display', 'flex');
    $('.start').css('display', 'none');
    $('.pause').css('display', 'flex');
    $('.terminate').css('display', 'flex');

    minNow = (mode == 'study' ? studyMins : restMins) * tomatoSize;
    secondNow = 0;
    remainingSeconds = parseInt(minNow) * 60 + parseInt(secondNow);
    $('.time .minute').html(minNow);
    $('.time .second').html(secondNow);
    formatTime();
    isStudying = mode == 'study' ? true : false;
};

function studyInterval() {
    remainingSeconds--;
    minNow = parseInt(remainingSeconds / 60);
    secondNow = Math.round(remainingSeconds % 60);
    $('.time .minute').html(minNow);
    $('.time .second').html(secondNow);
    $('svg circle').css('stroke-dashoffset', 340 + (1250 - 340) * remainingSeconds / studyMins / tomatoSize / 60); // 340 完全闭合 1250 空
    formatTime();
    if (remainingSeconds == 0) {
        clearInterval(stduyTimer);
        sound('timeup1');
        startRest();
    };
};

// 开始学习
function startStudy() {
    initClock('study');
    sound('ding');
    stduyTimer = setInterval(studyInterval, timerInterval);
};

// 暂停学习
function pauseStudy() {
    if (isStudying) {
        $('.pause').html('');
        isStudying = false;
        clearInterval(stduyTimer);
    } else {
        $('.pause').html('');
        isStudying = true;
        stduyTimer = setInterval(studyInterval, timerInterval);
    };
};

// 重置
function terminate() {
    initProgram();
    clearInterval(stduyTimer);
};

// 开始休息
function startRest() {
    initClock('rest');
    $('.pause').css('display', 'none');
    $('.terminate').css('display', 'none');

    let timer = setInterval(function() {
        remainingSeconds--;
        minNow = parseInt(remainingSeconds / 60);
        secondNow = Math.round(remainingSeconds % 60);
        $('.time .minute').html(minNow);
        $('.time .second').html(secondNow);
        $('svg circle').css('stroke-dashoffset', 340 + (1250 - 340) * remainingSeconds / restMins / tomatoSize / 60); // 340 完全闭合 1250 空
        formatTime();
        if (remainingSeconds == 0) {
            if (loop) {
                startStudy()
            } else {
                $('.time').css('display', 'none');
                $('.start').css('display', 'flex');
                $('svg circle').css('stroke-dashoffset', 1250);
            };
            clearInterval(timer);
        };
    }, timerInterval);
};

// 开始休息
function clickLoop() {
    loop = !loop;
    $('.loop .icon').html(loop ? '' : '');
    writeDataFromlocalStorage('loop', loop);
}